import React, { useState, useEffect } from 'react';
import styles from './index.less';
import { history, formatMessage, useIntl, getDvaApp } from 'umi';
import { Button } from 'antd';

export default (props) => {

  const [count, setCount] = useState(0);

  
  useEffect(() => {
    
  }, [])

  // 相当于选然后 以及更新生命周期
  useEffect(() => {
    document.title = `点击了${count}次`
  }, [count])


  return (
    <div>
      eeeeeeeeeeeeeeeeeeee
      <div>{count}</div>
      <Button onClick={() => { setCount(count + 1) }}>add</Button>
      <div>{useClock()}</div>
    </div>
  );
};


// 自定义hook，命名要以use开头
function useClock() {
  const [data, setData] = useState(new Date())
  useEffect(() => {
    // 只需要在didMont执行就可以了
    const timer = setInterval(() => {
      setData(new Date())
    }, 1000)

    // 清除定时器  相当与willUnmount
    return () => {
      clearInterval(timer)
    }
  }, [])
  return <div>{data.toLocaleTimeString()}</div>
}